<template>
  <div class="content-history">
    <LabelTitle text="基本信息"></LabelTitle>
    <div class="docxsl">
      <p
        class="item"
        v-for="(item, index) in doclist"
        :key="index"
        @click="downu(item)"
      >
        <img
          v-if="item.fileType == '1'"
          src="../../../assets/images/docx.png"
        />
        <img v-else src="../../../assets/images/pdf.png" />
        <span>{{ item.fileName }}</span>
      </p>
    </div>
    <LabelTitle text="问题记录"></LabelTitle>
    <div class="table-container bc-table">
      <el-table :data="tableData" style="width: 100%; height: 300px">
        <el-table-column
          type="index"
          :index="indexMethod"
          width="60px"
          label="序号"
        >
        </el-table-column>
        <el-table-column prop="issueDesc" label="隐患问题" />
        <el-table-column prop="rectificationRequire" label="整改要求" />
        <el-table-column prop="status" label="状态" />

        <el-table-column label="隐患照片">
          <template #default="scope">
            <img
              class="imgl"
              @click="showImg(scope.row.issuePhoto)"
              :src="scope.row.issuePhoto"
            />
          </template>
        </el-table-column>
        <el-table-column label="复查照片">
          <template #default="scope">
            <img
              class="imgl"
              @click="showImg(scope.row.recheckPhoto)"
              :src="scope.row.recheckPhoto"
            />
          </template>
        </el-table-column>
      </el-table>
    </div>
    <SelfDialog
      :dialogVisable="dialogVisable"
      height="320px"
      title="提示"
      @close="close"
      @confirm="confirm"
    >
      <template #default>
        <div class="center_content">
          <img class="icon-img" src="../../../assets/images/gth.png" />
          <p class="text">是否下载？</p>
        </div>
      </template>
    </SelfDialog>
  </div>
  <vue-easy-lightbox
    :visible="showpreve"
    :index="0"
    :imgs="urlCatch"
    @hide="showpreve = false"
  />
</template>
<script setup>
import { ElMessage } from "element-plus";
import LabelTitle from "@/components/labeltitle.vue";
import VueEasyLightbox from "vue-easy-lightbox";
import { Minxfun } from "@/utils/minxin.js";
import { getaqscxq } from "@/api/dazx.js";
import SelfDialog from "@/components/dialog/dialog.vue";
const { showImg, urlCatch, showpreve } = Minxfun();
const indexMethod = (index) => {
  return index + 1;
};

let dialogVisable = ref(false)
let downfileurl = ref('')

const props = defineProps({
  currentRow: Object,
});

let tableData = ref([]);
let doclist = ref([]);
// 获取问题记录
const getTableData = async () => {
  try {
    let { data } = await getaqscxq({
      inspectId: props.currentRow.id,
    });

    tableData.value = data.inspectionIssues;
    doclist.value = data.inspectionReports;
  } catch (e) {
    console.error(e);
  }
};

const downu = (item) => {
  dialogVisable.value = true;
  downfileurl = item.fileUrl
  console.log('11111111',item.fileUrl)
  // window.open(item.fileUrl);
};

watch(
  () => props.currentRow,
  (newData) => {
    if (newData && newData.id) {
      getTableData();
    }
  },
  {
    immediate: true,
    deep: true,
  }
);

// 取消下载
const close = () => {
  dialogVisable.value = false;
};
// 确认删除
const confirm = async () => {
  console.log('222222',downfileurl)
  try {
    window.open(downfileurl);
    // const a = document.createElement('a');
    // a.href = props.currentData.viewUrl;
    // a.download =  'downloaded-file';
    // document.body.appendChild(a);
    // a.click();
    // document.body.removeChild(a);
    ElMessage({
      message: "下载成功",
      type: "success",
    });
    dialogVisable.value = false;
  } catch (e) {
    console.error(e);
  }
};
</script>



<style lang="scss" scoped>
.content-history {
  width: 100%;
  height: 100%;
  padding: 0 40px 0 10px;
  .docxsl {
    padding: 20px;
    .item {
      height: 56px;
      background: #f6f9ff;
      border-radius: 12px;
      padding-left: 14px;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      margin-bottom: 8px;
      cursor: pointer;
      img {
        width: 29px;
        height: 34px;
      }
      span {
        margin-left: 10px;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 14px;
        color: #0091ff;
      }
    }
  }
  .table-container {
    padding: 20px;
    .imgl {
      width: 72px;
      height: 54px;
      cursor: pointer;
    }
  }
}
</style>